<template>
  <p> {{ timeString }}</p>
</template>

<script>
export default {
  data () {
    return {
      timer: null,
      timeDiff: 0
    };
  },
  mounted () {
    const startTime = Date.now();

    this.timer = setInterval(() => {
      this.timeDiff = Date.now() - startTime;
    }, 500);
  },
  computed: {
    timeString () {
      const ms = this.timeDiff;
      var allSeconds = parseInt(ms / 1000);
      var result = '';
      var hours, minutes, seconds;
      if (allSeconds >= 3600) {
        hours = parseInt(allSeconds / 3600);
        result += ('00' + hours).slice(-2) + ' : ';
      }
      if (allSeconds >= 60) {
        minutes = parseInt(allSeconds % 3600 / 60);
        result += ('00' + minutes).slice(-2) + ' : ';
      } else {
        result += '00 : ';
      }
      seconds = parseInt(allSeconds % 3600 % 60);
      result += ('00' + seconds).slice(-2);
      return result;
    }
  }
};
</script>

<style lang="scss" scoped>

</style>
